<div ng-controller="detailVedioCtr">
    <div ng-include="'tpl/logoDetail.html'" style="position: fixed;width: 100%;z-index: 10"></div>
    <!--配合导航固定定位高度和logo所在div一致-->
    <div style="width: 100%;height: 3.911rem"></div>
    <section id="wrapper" style="margin: 0">
        <div class="videoContainer">
            <video id="myVideo" controls preload="auto" poster="{{detailVedioObj.imgUrl}}" width="100%" height="200" ng-src="{{sceControl(detailVedioUrl)}}">
                <!--<source  type="video/mp4" />-->
                <!--<source src="http://demo.inwebson.com/html5-video/iceage4.webm" type="video/webM" />-->
                <!--<source src="http://demo.inwebson.com/html5-video/iceage4.ogv" type="video/ogg" />-->
                <p>Your browser does not support the video tag.</p>
            </video>

            <div class="control"style="display: block">
                <div class="topControl">
                    <div class="progress">
                        <span class="bufferBar"></span>
                        <span class="timeBar"></span>

                    </div>
                    <span class="timeBarBall"></span>
                </div>

                <div class="btmControl">
                    <div class="btnPlay btn btnplayOne" title="Play/Pause video"></div>
                    <div class="time" style="width:19%">
                        <span class="current"></span>
                        /<span class="duration"></span>
                    </div>
                    <!--<div class="btnStop btn" title="Stop video"></div>-->
                    <!--<div class="spdText btn">Speed: </div>-->
                    <!--<div class="btnx1 btn text selected" title="Normal speed">x1</div>-->
                    <!--<div class="btnx3 btn text" title="Fast forward x3">x3</div>-->
                    <div class="btnFS btn btnTwo" title="Switch to full screen"></div>
                    <!--<div class="btnLight lighton btn" title="Turn on/off light"></div>-->
                    <!--<div class="volume" title="Set volume">-->
                    <!--<span class="volumeBar"></span>-->
                    <!--</div>-->
                    <!--<div class="sound sound2 btn" title="Mute/Unmute sound"></div>-->
                </div>

            </div>
            <div class="loading"></div>
        </div>
        <!-- Navigation -->
        <div class="detaVedioTitText">
            <p class="detaVedioTitText1">{{detailVedioObj.title}}</p>
            <p class="detaVedioTitText2"><span>{{detailVedioObj.publishtime|actHour}}</span>
                <span class="detaVedioTitText2p2">{{detailVedioObj.countClick}}次播放</span>
            </p>

        </div>
    </section>
    <div style="height:10px;width:100%;background:#f6f6f6;"></div>
    <!--<div class="xyapp">-->
        <!--<img src="static/18.png">-->
        <!--<span>更多精彩下载app客户端</span>-->
    <!--</div>-->
    <app-down-load></app-down-load>
    <div ng-if="detailVedioData.length>0" class="" style="padding: 0 1.333rem">
        <div class="vedeio_relat-titl"><span>相关视频</span></div>
        <div>
            <ul class="detaiVedio">
                <li  class="detaiVediorow"  ng-repeat="item in detailVedioData|limitTo:2">
                    <div class="detaiVedioCol1">
                        <h4 ng-click="jump('/detailVedio/'+item.relId)">{{item.title}}</h4>
                        <p class="detaiVedio_text"><span>{{item.publishtime|fomatTime}}</span><span class="detaiVedio_text2">{{item.source}}</span></p>
                    </div>
                    <div class="detaiVedioCol2">
                        <div class="live_vedio" style="width: 100%">
                            <img ng-click="jump('/detailVedio/'+item.relId)" src="{{item.picS}}" >
                        </div>
                        <span class="relatVediImagDuration">{{item.vTime}}</span>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <div style="height:10px;width:100%;background:#f6f6f6;"></div>
    <!--评论 2表示关闭全站-->
    <div ng-if="siteConfigAuditType!=2&&currentDiscussClosed!=1" ng-include="'tpl/vedioComTpl.html'"></div>

    <div class="fiBtn">
        <div ng-show=true ng-click="goBackTop()" class="baToTop">
            <img src="static/19.png" alt="">
        </div>
    </div>
    <div class="fiBtnTop">
        <div ng-show=true ng-click="home()" class="baToTop">
            <img src="static/20.png" alt="">
        </div>
    </div>
</div>
<script src="trd/vendorscript.js"></script>
<script src="trd/video.js"></script>
<!--<script src="trd/toucher/toucher.js"></script>-->
<!--<link rel="shortcut icon" href="http://www.inwebson.com/wp-content/themes/inwebson/favicon.ico" />-->
<script type="text/javascript">
    $(document).ready(function() {
        $('.control').hide();
        $('.loading').fadeOut(500);
        $('.caption').fadeOut(500);
    });

    console.log("视频");
    console.log($("#myVideo"));

</script>
<style>
    /*yxapp*/
    /*  .xyapp{
          margin: 30px 1.333rem;
          border-top: 1px solid #e3e3e3;
          border-bottom: 1px solid #e3e3e3;
      }
      .xyapp img{
          transform: scale(0.5);
          -webkit-transform: scale(0.5);
          -moz-transform: scale(0.5);
          -ms-transform:scale(0.5);
          -o-transform: scale(0.5);
      }*/
    .detaiVediorow{
        position: relative;
    }
    .detaiVediorow>div{
        float: left;
    }
    .detaiVedioCol1{
        width: 60%;
    }
    .detaiVedioCol1 h4{
        color: #333333;
        font-size: 1.333rem;
    }
    .detaiVedioCol1 p{
        color: #999999;
        font-size: 1.155rem;
    }
    .detaiVedioCol2{
        width: 40%;
        position: relative;
    }
    .detaiVedioCol2 img{
        width: 100%;
        height: 100%;
    }
    .detaiVedioCol2>div{
        width: 11.333rem;
        max-height: 130px;
        min-height: 77px;
        overflow: hidden;
    }
    .detaiVedio li{
        overflow: auto;
        padding: 1.333rem 0;
    }
    .detaiVedio li:nth-of-type(2){
        border-top: 1px solid #e3e3e3
    }

    .detaiVedio li div video{
        width: 11.333rem;
        border: 1px solid #eee;
    }
    .detaiVedio_text{
        position: absolute;
        bottom: 12px;
        width: 60%;
    }
    .detaiVedio_text2{
        margin-left: 1.333rem;
    }
    .vedeio_relat-titl{
        margin: 0 0 1.333rem 0;
    }
    .vedeio_relat-titl span{
        border-left:2px solid #FCA204 ;
        padding: 0 10px;
    }
    .detaVedioTitText{
        padding:1.333rem;
    }
    .detaVedioTitText1{
        color: #333333;
        font-size: 1.333rem;
        margin-bottom:1.333rem;
    }
    .detaVedioTitText2{
        color: #999999;
        font-size: 1.155rem;
    }
    .detaVedioTitText2p2{
        margin-left: 1.333rem;
    }
    .detaiVedoH{
        position: relative;
        width: 100%;
        top: -8px;
    }
    .relatVediImagDuration{
        background: #444444;
        position: absolute;
        color: #ffffff;
        border-radius: 3px;
        bottom:5px;
        right: 5px;
        font-size: 1.155rem;
        padding: 0 3px;
    }
</style>

